<template>
	<view class="">
		<view class="info">
			<view class="title">温馨提示:</view>
			<view class="contant">新创建的团需在7天内加满3人，逾期不满足条件的跑团将会被解散。为了更加方便跑团管理，请下载app:</view>
			<view class="erweima"><image src="https://ykp-new.oss-cn-hangzhou.aliyuncs.com/client/01.jpeg" mode=""></image></view>
			<!-- 后台网址 -->
			<view class="backstage">
				<view class="title">管理后台网址：</view>
				<view class="web">http://rcs.unirunning.com/home/index</view>
			</view>
			<view class="setting_app">设置APP登录密码</view>
			<view class="password">
				<view class="password_one">
					<view class="l">密码</view>
					<view class="password_one_r">
						<input type="text" v-model="passWord" :password="flag_pass_one" placeholder-class="place" maxlength="6" placeholder-style="font-size:28upx" placeholder="请输入密码" />
						<view class="eye" @tap="changepassone">
							<i class="icon" v-if="flag_pass_one">&#xe60c;</i>
							<i class="icon" v-else>&#xe6dd;</i>
						</view>
					</view>
				</view>
				<view class="password_two">
					<view class="l">确认密码</view>
					<view class="password_one_r">
						<input type="text" v-model="OpassWord" :password="flag_pass_two" placeholder-class="place" maxlength="6" placeholder-style="font-size:28upx" placeholder="请再次输入密码" />
						<view class="eye" @tap="changepasstwo" >
							<i class="icon" v-if="flag_pass_two">&#xe60c;</i>
							<i class="icon" v-else>&#xe6dd;</i>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="btn" @tap="surePass">确定</view>
		<navigation></navigation>
	</view>
</template>

<script>
import navigation from '@/components/navigation/navigation.vue';
export default {
	components: {
		navigation
	},
	data() {
		return {
			flag_pass_one: true,
			flag_pass_two: true,
			passWord:'',
			OpassWord:''
			
		};
	},
	methods: {
		surePass() {
			if(this.OpassWord != this.passWord) {
				this.toast('两次密码输入不一致')
				return false
			}
			this.ajax('club/setAppPwd', {
				data:{
					pwd:this.passWord
				},
				success: res => {
					this.toast('创建成功')
					setTimeout(function() {
						uni.reLaunch({
							url:'/pages/index/index'
						})
					}, 1000);
				}
			})
		},
		changepassone() {
			this.flag_pass_one = !this.flag_pass_one;
		},
		changepasstwo() {
			this.flag_pass_two = !this.flag_pass_two;
		}
	}
};
</script>

<style lang="less" scoped>
page {
	background-color: #f2f2f2;
}
.info {
	width: 100%;
	background-color: #fff;
	padding: 0 30upx;
	box-sizing: border-box;
}
.title {
	height: 100upx;
	color: #333333;
	font-size: 32upx;
	line-height: 100upx;
	font-weight: bold;
}
.contant {
	width: 100%;
	font-size: 28upx;
	color: #333333;
	height: 100upx;
	line-height: 50upx;
	white-space: wrap;
}
.erweima {
	width: 250upx;
	height: 250upx;
	overflow: hidden;
	margin: 50upx auto;
	image {
		width: 100%;
		height: 100%;
	}
}
.backstage {
	display: flex;
	justify-content: center;
	.title {
		font-size: 28upx;
		color: #333333;
		font-weight: 400;
		height: 40upx;
		line-height: 40upx;
	}
	.web {
		padding: 0 20upx;
		box-sizing: border-box;
		font-size: 24upx;
		color: #ffffff;
		height: 40upx;
		line-height: 40upx;
		background-color: #ff6600;
	}
}
.password {
	width: 100%;
	height: 200upx;
	.password_one,
	.password_two {
		width: 100%;
		height: 90upx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		.l {
			width: 140upx;
			font-size: 28upx;
			color: #333333;
		}
		.password_one_r {
			position: relative;
			width: 526upx;
			height: 74upx;
		}
		input {
			width: 526upx;
			height: 74upx;
			border: 2upx solid #e1e1e1;
			border-radius: 8upx;
			padding-left: 30upx;
			font-size: 28upx;
			box-sizing: border-box;
		}
		.eye {
			position: absolute;
			right: 20upx;
			top: 50%;
			transform: translateY(-50%);
			.icon {
				font-size: 28upx;
				color: #999999;
				height: 28upx;
			}
		}
	}
}
.btn {
	width: calc(100% - 60upx);
	margin: 50upx auto;
	height: 90upx;
	background-color: #8938d3;
	border-radius: 45upx;
	color: #ffffff;
	font-size: 32upx;
	text-align: center;
	line-height: 95upx;
}
.setting_app {
	height: 100upx;
	color: #333333;
	font-size: 32upx;
	line-height: 100upx;
	font-weight: bold;
}
</style>
